<!-- <template>
	<view class="centeng">
		<view class="cengt">
			<image src="https://gfgn.oss-cn-beijing.aliyuncs.com/temp/20241130162908_1732955377316.png"
				class="inviteBj">
			</image>
			<image :src="recQcCode" class="codeImg"></image>
		</view>
		<view class="button">
			保存图片
		</view>
	</view>

</template> -->
<template>
	<view class="centeng">
		<view class="cengt">
			<l-painter ref="painter">
				<l-painter-image src="https://gfgn.oss-cn-beijing.aliyuncs.com/temp/20241130162908_1732955377316.png"
					css="width: 600rpx; height: 1200rpx;" class="inviteBj" />
				<l-painter-view css="width: 192rpx;position: absolute; bottom:458rpx;right: 16rpx;">
					<l-painter-text :text="realname + '推荐'" css="font-size: 30rpx;color: #ffffff;fontWeight: 700;" />
				</l-painter-view>
				<l-painter-image :src="recQcCode"
					css="width: 242rpx; height: 242rpx; border-radius: 120rpx; 	position: absolute; bottom: 38rpx;	right: 26rpx;"
					class="codeImg" />
			</l-painter>
		</view>
		<view class="button" @click="ok">
			保存图片
		</view>
	</view>

</template>

<script>
	import {
		myRecommendCode,
		myRecommend
	} from '../../common/api.js'
	export default {
		data() {
			return {
				userInfo: {},
				list: [],
				recCount: 0,
				recQcCode: '',
				recCode: '',
				realname: ''
			}
		},
		onShow() {
			// #ifdef MP-WEIXIN
			this.userInfo = uni.getStorageSync('userInfo')
			// this.userInfo.realname = '请请轻轻起'
			if (this.userInfo.realname && this.userInfo.realname.length > 4) {
				this.realname = this.userInfo.realname.substring(0, 3) + '...';
			} else {
				this.realname = this.userInfo.realname;
			}
			// #endif
			this.myRecommendCode()
		},
		onShareAppMessage(res) {
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			let url = '/pages/index/index?scene=' + this.recCode
			return {
				title: '快来一起干饭吧！', //olK6XJSO
				path: url
			}
		},
		methods: {
			ok() {
				this.$refs.painter.canvasToTempFilePathSync({
					fileType: 'jpg',
					pathType: 'url',
					quality: 1,
					success: (res) => {
						uni.saveImageToPhotosAlbum({
							filePath: res.tempFilePath,
							success: function() {
								console.log('save success');
							}
						});
					},
					fail(e) {
						console.log(e)
					}
				})
			},
			myRecommendCode() {
				myRecommendCode(this.userInfo.id).then(res => {
					this.recCount = res.result.recCount
					this.recCode = res.result.recInfo.recCode
					this.recQcCode = 'data:image/png;base64,' + res.result.recInfo.recQcCode
				})
				myRecommend(this.userInfo.id).then(res => {
					this.list = [...res.result.firstRec, ...res.result.secondRec]
				})
			},
			goback() {
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
</script>

<style scoped>
	.centeng {
		width: 100vw;
		height: 100vh;
		background-color: #f1f1f1;
	}

	.button {
		width: 600rpx;
		height: 80rpx;
		background-color: #f79728;
		color: #fff;
		margin-top: 100rpx;
		border-radius: 55rpx;
		line-height: 80rpx;
		text-align: center;
		font-size: 34rpx;
		position: relative;
		left: 50%;
		transform: translateX(-50%);
	}

	.cengt {
		width: 600rpx;
		height: 1200rpx;
		position: relative;
		top: 50rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.back {
		position: absolute;
		top: var(--status-bar-height);
		left: 30rpx;
		width: 48rpx;
		height: 48rpx;
		margin-top: 3vh;
	}

	.codeImg {
		width: 242rpx;
		height: 242rpx;
		margin: 104rpx 0 56rpx;
		position: absolute;
		bottom: -17rpx;
		right: 26rpx;
		border-radius: 100%;
	}

	.inviteBj {
		width: 600rpx;
		height: 1200rpx;
		position: absolute;
		top: 0;
		left: 0;
	}
</style>